<?php 
require_once dirname(__FILE__) . '/../includes/common.inc.php';
require_once dirname(__FILE__) . '/../includes/pdoorm.inc.php';

    if(isset($_REQUEST['act']) && $_REQUEST['act'] == 'out')
    {
        unset($_SESSION['pwd']);
	    session_destroy();
		setcookie(pwd,'', (time() - 36000), PATH, DOMAIN);
    }

?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>IPAD SIGN</title>
  <style>
  body{
   margin:0px;
   font-family:Arial;
   font-size:13px;
   
   background:#d9d6cd;
  }
  img{
   border:0px;
  }
 .content{
    /*width:768px;
    height:1024px;*/
    margin-left:auto;
    margin-right:auto;
 }
 .logo{
   margin-top:200px;
 }
 .numkeybord{
   margin-left:auto;
   margin-right:auto;
 }
 .kb{
   background-image: url(images/login-bk.png);
 }
 .uli{
   list-style-type:none;
   margin-left:-40px;
 }
 .uli li{
   float:left;
 }
 .m1{
    margin-top:-1px;
 
 }
 .over{border:1px solid #ccc;}

  </style>
  <script type="text/javascript" src="../jquery-1.7.1.min.js"></script>
  <script type="text/javascript">

	   
    function numclick(id)
    {

       if(isNaN(id))
       {
           if(id == 'clear')
           {
               $("#showlist li img").each(function(){
                       this.src = "images/frame.png";
                       this.alt = "1";
                       this.className = '';
                 });                 
           }

           if(id == 'delete') 
           {
                 $("#showlist li img[alt='2']:last")[0].src = "images/frame.png";
                 $("#showlist li img[alt='2']:last")[0].alt = "1";
           }
           
       }else{
          $("#showlist li img").each(function(){
	              if(this.alt == 1)
	              {
	                  this.src = "images/frame2.png";
	                  this.alt = "2";
	                  this.className = id;
	                 return false;
	              }
            });

          
         //$("#num1")[0].src = 'images/2.png';
    
       }
       

   	   var leng = $("#showlist li img[alt='2']").length;
	   
	   if(leng == 4)
 	   {
	 	   var pword ='';
	 	   
		   $("#showlist li img[alt='2']").each(function(){

			   pword +=  this.className; 
			   });
          $.ajax({
		  			type:'POST',
					url:'server.php',
					data:'password='+ pword +'&action=login',
					dataType: "json",
					beforeSend:function(){
                       //$("#keybord").append("<img src='../images/common/loading.gif'>");
	                  
				    },
					success:function(data){
                           if(data == 1)
                           {
                               window.location.href = 'home.php'
                           }else{
                               
                               $("#showlist li img").each(function(){
                                   this.src = "images/frame.png";
                                   this.alt = "1";
                                   this.className = '';
                             });
                                 
                           }
						}	
                  

              });
       }
    }
    
  </script>
 </head>

 <body >
 <div class="content">
    
     <div class="numkeybord">
      <!-- logo -->
        <table align="center" class="logo">
	      <tr>
	         <td><img src="images/log.png"></td>
	      </tr>                  
        </table>
         <!-- logo -->
         
         <!-- numkeybord -->
         <div id='keybord'>
         <table align="center" class="kb" width="300px" height="305px">
	      <tr>
	         <td>
                 <ul class='uli' id="showlist">
                    <li>&nbsp;&nbsp;&nbsp;<img src="images/frame.png"  alt="1">&nbsp;&nbsp;</li>
                    <li><img  src="images/frame.png"  alt="1">&nbsp;&nbsp;</li>
                    <li><img src="images/frame.png"  alt="1">&nbsp;&nbsp;</li>
                    <li><img src="images/frame.png"  alt="1"></li>
                 </ul>
             </td>
	      </tr>         
	      <tr>
	         <td>
                 <ul class='uli m1'>
                    <li>&nbsp;&nbsp;&nbsp;<img  src="images/1.png" id='num1' onclick="numclick(1);">&nbsp;</li>
                    <li><img src="images/2.png" onclick="numclick(2);">&nbsp;</li>
                    <li><img src="images/3.png" onclick="numclick(3);"></li>
                 </ul>
             </td>
	      </tr>                  

	      <tr>
	         <td>
                 <ul class='uli m1'>
                    <li>&nbsp;&nbsp;&nbsp;<img src="images/4.png" onclick="numclick(4);">&nbsp;</li>
                    <li><img src="images/5.png" onclick="numclick(5);">&nbsp;</li>
                    <li><img src="images/6.png" onclick="numclick(6);"></li>
                 </ul>
             </td>
	      </tr>
	      <tr>
	         <td>
                 <ul class='uli m1'>
                    <li>&nbsp;&nbsp;&nbsp;<img src="images/7.png" onclick="numclick(7);">&nbsp;</li>
                    <li><img src="images/8.png" onclick="numclick(8);">&nbsp;</li>
                    <li><img src="images/9.png" onclick="numclick(9);"></li>
                 </ul>
             </td>
	      </tr>
	      <tr>
	         <td>
                 <ul class='uli m1'>
                    <li>&nbsp;&nbsp;&nbsp;<img src="images/clear.png" onclick="numclick('clear');">&nbsp;</li>
                    <li><img src="images/0.png" onclick="numclick(0);">&nbsp;</li>
                    <li><img src="images/delete.png" onclick="numclick('delete');"></li>
                 </ul>
             </td>
	      </tr>
        </table>    
        </div>    
          <!-- numkeybord -->
         
     </div>
   
    
   
 </div>
  
 </body>
</html>